<ng-container *ngIf="!item.hidden">

    <a class="nav-link"
       *ngIf="item.url"
       [ngClass]="item.classes"
       [routerLink]="[item.url | path: item.urlParam]"
       [routerLinkActive]="['active', 'secondary-background']"
       [routerLinkActiveOptions]="{exact: item.exactMatch || false}"
       matRipple>
        <mat-icon class="nav-link-icon" *ngIf="item.icon">{{item.icon}}</mat-icon>
        <span class="nav-link-title" [translate]="item.i18n"></span>
        <span
            class="nav-link-badge"
            *ngIf="item.badge"
            [ngStyle]="{'background-color': item.badge.bg, 'color': item.badge.fg}">
            {{item.badge.title}}
        </span>
    </a>

</ng-container>
